import { useEffect, useState } from "react";
import sty from "./Unit.module.css";

export default function (props) {
  let [color, setColor] = useState("");
  let [successColor, setSuccessColor] = useState("");
  useEffect(() => {
    switch (props.color) {
      case 0:
        setColor("");
        break;
      case 1:
        setColor(sty.black);
        break;
      case 2:
        setColor(sty.white);
        break;
    }
    if(props.success){
      setSuccessColor(sty.success)
    }else{
      setSuccessColor('')
    }
  })
  return (
    <div className={sty.square}>
      <div className={sty.zi + " " + color +" " + successColor}></div>
      <span className={sty.su}></span>
      <span className={sty.heng}></span>
    </div>
  );
}

export const Black= ()=><div className={sty.zi + " " + sty.black}></div>
export const White= ()=><div className={sty.zi + " " + sty.white}></div>